<template>
	<view class="flex-justAliCenter-column login-bg">
		<image class="logo-view flex-center margin-top150 border-radius10" style="background-color: #ffffff;" src="../../static/logo.png" mode=""></image>
		<view class="fontSize-18 color-000 margin-top30 fontWeight-bold">欢迎使用</view>
		<view class="padding-30 width-600rpx">
			<button open-type="getPhoneNumber" @getphonenumber="getphonenumber" class="phone-code">
				<view class="fontSize-15 color-fff margin-left20">手机号快捷登录</view>
			</button>
			<view class="margin-top20 color-2EA5F5 fontSize-15 text-center" @click="closeLogin">取消登录</view>
		</view>
		<view class="flex-center margin-top20">
			<view class="flex"  @click="isSelect = !isSelect">
				<image v-if="isSelect" class="img-32 margin-right20" src="../../static/image/checked.png" mode="widthFix"></image>
				<image v-else class="img-32 margin-right20" src="../../static/image/check.png" mode="widthFix"></image>
			</view>
			<view class="fontSize-13 color-999">我已阅读并同意
				<text style="color: #4B6DFD;" @click="gotoUrl('用户协议')">《用户协议》</text> 及
				<text style="color: #4B6DFD;" @click="gotoUrl('隐私政策')">《隐私政策》</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isSelect:false,
				logincode:'',
				baseUrlImage:''
			}
		},
		onLoad() {
			// this.getCode()
			// this.baseUrlImage = this.$api.uploadImage
		},
		onShow() {
			// this.baseUrlImage = this.$api.uploadImage
		},
		methods: {
			// 跳转到协议页面
			gotoUrl(value){
				this.$tools.navigateTo('/pages/login/agreement?status='+value)
			},
			// 取消登录
			closeLogin(){
				this.$tools.switchTab('/pages/index/index')
			},
			// 获取微信code
			getCode() {
				this.$wxApi.loginApi().then(res => {
					console.log(res)
					this.logincode = res.code
				})
			},
			getphonenumber(event) {
				let that = this
				if (event.detail.errMsg == "getPhoneNumber:fail user deny") {
					uni.showToast({
						title: '授权失败',
						icon: "none"
					})
					return
				}
				if (this.isSelect) {
					this.$http.post(this.$api.wechat_login, {
						login_code: this.logincode,
						phone_code: event.detail.code
					}, {
						token: true
					}).then(res => {
						if (res.code == 1) {
							uni.setStorageSync('userinfo', res.data.userinfo)
							uni.setStorageSync('token', res.data.userinfo.token)
							this.$tools.toast('登录成功')
							this.$tools.navigateBack()
						} else {
							uni.showToast({
								title: res.msg,
								icon: "none"
							})
						}
					})
				} else {
					uni.showToast({
						title: '请勾选用户协议',
						icon: "none"
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.bg-967C5E{
		background-color: #967c5e;
	}
	.phone-code {
		width: 600rpx;
		height: 100rpx;
		border-radius: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #4B6DFD;
		color: #FFFFFF;
		border: 0;
		margin-top: 100rpx;
		box-shadow: 0rpx 0rpx 10rpx 1rpx rgba(0,0,0,0.18);
	}
	.login-bg{
		// width: 100%;
		// height: 100vh;
	}
	.logo-view {
		width: 200rpx;
		height: 200rpx;
		// background: #5A8AFF;
		// border-radius: 30rpx;
	}
</style>